<section class="section">
  <h2>Preformatted Text</h2>
  <section>
    <h3>Pre</h3>
    <pre>This is a test
    using
pre
 with different 
         indentations</pre>
    <details class="demo">
      <summary>View code</summary>
      <pre><code>&lt;pre&gt;This is a test
    using
pre
 with different 
        indentations&lt;/pre&gt;</code></pre>
    </details>
  </section>
  <section>
    <h3>Pre with Code</h3>
    <pre><code>#include &lt;stdio.h&gt;

// this is a line with really long text to show that now the gray background goes all the way, instead of limiting to the wisth of the main.
int main(void) {
  printf("Hello World");
  return 0;
}</code></pre>
    <details class="demo">
      <summary>View code</summary>
      <pre><code>&lt;pre&gt;&lt;code&gt;#include &lt;stdio.h&gt;

// this is a line with really long text to show that now the gray background goes all the way, instead of limiting to the wisth of the main.
int main(void) {
  printf("Hello World");
  return 0;
}&lt;/code&gt;&lt;/pre&gt;</code></pre>
    </details>
  </section>
</section>